<template>
    <div class="addGoods">
        <div class="noproduct">
            <div class="icon-img">
                <img src="../assets/img/gouwu.png" alt="">
            </div>
            <div class="kong">
                <span>购物车空空如也</span>
            </div>
            <div class="tagProduct">
                <span>Follow Me,一起去挑选美物吧</span>
            </div>
            <div class="tag-btn" @click="toHome">
                <span>马上去逛逛</span>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    methods:{
        toHome(){
            this.$router.push({path:"/home"})
        }
    }
}
</script>

<style lang="less">
.addGoods{
   width: 98%;
   height: 300px;
   background: #fff;
   border-radius: 20px;
   margin-top: 10px;
   margin-left: 5px;
}
.noproduct{
    overflow: hidden;
     .icon-img{
         width: 120px;
         height: 120px;
         background: pink;
         border-radius: 50%;
         margin: 10px auto 0px;
         img{
             width: 100%;
             height: 100%;
             display: block;
         }
     }
     .kong{
         height: 30px;
         text-align: center;
         font-size: 20px;
         margin-top: 10px;
         font-weight: bold;
     }
     .tagProduct{
         height: 30px;
         text-align: center;
         font-size: 16px;
         color: #666;
         margin-top: 10px;
     }
     .tag-btn{
         width: 100px;
         height: 30px;
         line-height: 30px;
         color: #b00cd4;
         border: 2px solid #ad01da;
         border-radius: 20px;
         text-align: center;
         margin: 0 auto;
         font-size: 16px;
         font-weight: bold;
         margin-top: 20px;
     }
}
</style>